<div class="modal-header">
    <h3>
        Change log
        from <b>{{config.changeLog.scmBuildFrom.buildView.build.name}}</b>
        to <b>{{config.changeLog.scmBuildTo.buildView.build.name}}</b>
    </h3>
</div>
<div class="modal-body form-horizontal">

    <div class="form-group">
        <label for="exportFormat" class="col-md-3">Export format:</label>

        <div class="col-md-4">
            <select ng-model="exportRequest.format" class="form-control"
                    required="required" id="exportFormat"
                    ng-options="format.id as format.name for format in exportFormats">
            </select>
        </div>
    </div>

    <div class="form-group">
        <label class="col-md-3">Grouping:</label>

        <div class="col-md-9 ot-field-grouping">
            <div class="form-group" ng-repeat="group in exportRequest.grouping">
                <div class="col-md-11 ot-field-grouping-input">
                    <div class="input-group">
                        <input ng-model="group.name" type="text" class="form-control" placeholder="Group" />
                        <span class="input-group-addon">
                            <span class="fa fa-arrows-h"></span>
                        </span>
                        <input ng-model="group.types" type="text" class="form-control" placeholder="Comma-separated issue types" />
                    </div>
                </div>
                <!-- Group removal -->
                <div class="col-md-1 ot-field-grouping-delete">
                    <span class="ot-command ot-command-delete" title="Removes group." ng-click="removeGroup(exportRequest.grouping, group)"></span>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12">
                    <button title="Add a group" class="btn btn-default btn-xs" ng-click="addGroup()">
                        <span class="ot-command-new"></span>
                    </button>
                </div>
            </div>
        </div>
    </div>

    <div class="form-group">
        <label for="exportExclude" class="col-md-3">Exclude:</label>

        <div class="col-md-9">
            <input id="exportExclude" ng-model="exportRequest.exclude" type="text" class="form-control"
                   placeholder="Comma-separated issue types to exclude"/>
        </div>
    </div>

    <div class="form-group">
        <div class="col-md-12">
            <textarea ng-bind="exportContent" ng-show="exportContent"
                      rows="16"
                      class="form-control" readonly="readonly"></textarea>
        </div>
    </div>

    <div class="form-group" ng-show="exportPermaLink">
        <label class="col-md-3">
            <span class="fa fa-link"></span>
            Permalink
        </label>

        <div class="col-md-9">
            <input class="form-control" type="text" readonly="readonly" ng-model="exportPermaLink"/>
        </div>
    </div>

</div>
<div class="modal-footer">
    <div class="alert alert-danger" ng-show="exportError">
        {{exportError}}
    </div>
    <button class="btn btn-primary" type="button"
            ng-click="doExport()"
            ng-disabled="exportCalling">
        <span class="fa fa-spinner fa-spin" ng-show="exportCalling"></span>
        Export
    </button>
    <button class="btn btn-link" type="button" ng-click="cancel()">Close</button>
</div>